<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%  
	String path = request.getContextPath();  
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css">
<script src="/bsc/static/js/jquery-3.1.1.js"></script>
<script src="/bsc/static/common/bootstrap/js/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

</head>
<body>
		<form action="<%=basePath %>typeSel" method="post">
			分类名称：
				<input type="text" name="type_name" />
				
					<input type="submit" value="查询" /> 
					<input type="reset" value="重置" />
					<input type="button" value="添加"  data-toggle="modal"  data-target="#myModal1"> 
		</form>
	<center>
		<table class="table table-bordered table table-hover">
			<tr align="center">  
				<td>分类名称</td>
				<td>备注</td>
				<td>排序</td>
				<td>更新时间</td>
				<td>操作</td>  
			</tr>
			<c:forEach items="${list }" var="cx">
				<tr align="center">
					<td  style="display: none;">${cx.type_id }</thfd>
					<td>${cx.type_name }</td>
					<td>${cx.type_remark }</td>
					<td>${cx.sort_no }</td>
					<td>${cx.create_time }</td>
					<td>
						<a href="<%=basePath%>typedel/${cx.type_id}">删除</a>
						<button id="test1" data-toggle="modal"  data-target="#myModal1" onclick='updatetype(${cx.type_id})'>修改</button>
					</td>
				</tr>
			</c:forEach>
		</table>
	</center>
	
	<!-- Button trigger modal -->
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">修改信息</h4>
      </div>
      <div class="modal-body">
       	<form method="post" action="<%=basePath%>typeupd" >
        	<table align="center"  class="table table-bordered table table-hover">
        		<input type="hidden" id="type_id" name="type_id"/>
        		<tr>
        			<td>分类名称：</td>
        			<td>
        				<input type="text" id="type_name" name="type_name"/>
        			</td>
        		</tr>
        		<tr>
        			<td>排序号：</td>
        			<td>
        				<input type="number" id="sort_no" name="sort_no" min="1"/>
        			</td>
        		</tr>
        		<tr>
        			<td>备注：</td>
        			<td>
        				<input type="text" id="type_remark" name="type_remark"/> 
        			</td>
        		</tr>
        	</table>
        	<div class="modal-footer">
		        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
		        <input type="submit" class="btn btn-primary" value="保存"/>
		    </div>
       </form>
      </div>      
    </div>
  </div>
</div>
</body>
</html>
<script type="text/javascript">
	function updatetype(tid){
		console.log(tid);
		$.ajax({
			type:"POST",
			url:"<%=basePath%>typeupdByid/"+tid,
			dataType:"json",
			success: function(msg){
				console.log(msg.type_id);
				console.log(msg.type_name);
				 $("#type_id").val(msg.type_id);
				$("#type_name").val(msg.type_name);
				$("#sort_no").val(msg.sort_no);
				$("#type_remark").val(msg.type_remark); 
			//	$('#myModal1').modal('show');
		   }
		});
	}
	
	//重置
	function reset(){
		$("#type_id").val("");
		$("#type_name").val("");
		$("#sort_no").val("");
		$("#type_remark").val("");
	}

	$('#myModal1').on('hidden.bs.modal', function (e) {
		reset();
	})
</script>